<template>
  <div class="address">
    <van-nav-bar
        title="我的收货地址"
        left-text="关闭"
        left-arrow
        @click-left="onClickLeft"
    />
    <div class="address_one">
      <div>
        <div style="font-size: 18px;font-weight: bold">
          <span>tcj</span>&nbsp;
          <span>先生</span>&nbsp;
          <span>1234678912</span>
        </div>
        <div class="shang">
          <van-tag color="#ffe1e1" text-color="#ad0000">&nbsp;家&nbsp;</van-tag>
          <p class="dizhi">的哈京东快递好看的江湖再见抗洪救灾按键打开杜卡迪奥科吉地理试卷</p>
        </div>
      </div>
      <el-icon>
        <edit/>
      </el-icon>
    </div>
    <van-button color="#ffcc33" size="large" class="add" @click="toNewAddress">新增收货地址</van-button>
  </div>
</template>
<script>
import {Edit} from '@element-plus/icons'

export default {
  components: {
    Edit
  },
  setup() {
    const onClickLeft = () => history.back();
    return {
      onClickLeft,
    };
  },
  methods:{
    toNewAddress(){
      this.$router.push('/newaddress');
    }
  }
};

</script>
<style>

* {
  margin: 0;
  padding: 0;
}
.address{
  width:100%;
  height: 100%;
  position: absolute
}
.address .van-nav-bar {
  background: #f4f4f4;
}

.address_one {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 15px 15px 15px 15px;
}
.add{
  position: absolute;
  bottom: 0px;
}
.shang{
  display: flex;
}
.dizhi{
  width: 320px;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  font-size: 14px;
  color: #999999;
}
</style>